import React, {useEffect, useState} from 'react';
import {Alert, Image, Linking, Modal, StyleSheet, Text, TouchableOpacity, View} from 'react-native';
import { CommonPicker } from "@yz1311/react-native-wheel-picker";

const SinglePicker = ({pickerData, onPickerConfirm, onPickerCancel}) => {
    return (
        <View style={styles.container}>
            <View style={styles.mask}>
                <CommonPicker
                    pickerData={pickerData}
                    itemStyle={{ fontSize: 12 }}
                    onPickerConfirm={(item) => onPickerConfirm(item)}
                    onPickerCancel={onPickerCancel}
                    selectedValue={['']} />
            </View>
        </View>
    );
};

const styles = StyleSheet.create({
    container: {
        position: 'absolute',
        left: 0,
        right: 0,
        top: 0,
        bottom: 0,
        zIndex: 100,
    },
    mask: {
        width: '100%',
        height: '100%',
        backgroundColor: 'rgba(0,0,0,0.5)',
        flexDirection: 'column',
        justifyContent: 'flex-end',
    }
});

export default SinglePicker;